<template>
  <div>
      <el-row>
          <el-col :span="6"><div style="height:40px;line-height:40px;">全部分类 > 笔记本 > mac电脑</div></el-col>
      </el-row>
      <el-row type="flex" justify="center">
        <el-col :span="8">
            <img src="/static/slide01.jpg">
        </el-col>
        <el-col :span="10">
            <p>{{goods.name}}</p>
            <p>{{goods.desc}}</p>
            <p>{{goods.price}} 元</p>
            <p>数量<el-input-number v-model="num" ></el-input-number></p>
            <p>属性:</p>
            <p v-for="(item,item1) in params" :key="item1">
                <span>{{item1}}:{{item}}</span>
            </p>
            <p>{{num*goods.price}} 元</p>
            <p><el-button>立即购买</el-button>  <el-button type="danger">添加购物车</el-button></p>
        </el-col>
      </el-row>
  </div>
</template>

<script>

export default {
    data(){
        return {
           id:this.$route.query.id,
           goods:{},
           num:1,
           params:{}
        }
    },
    created(){
        this.axios.get("/goodsinfo/"+this.id+"/").then(resp=>{
            console.log(resp.data)
            this.goods=resp.data
            // 把json字符串  转成JSON对象  对象才可以进行 遍历取值
            this.params=JSON.parse(resp.data.params)
        }).catch(error=>{
            console.log(error)
        })
    }
}
</script>

<style>

</style>
